<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
</head>
  <!--引入开发版本Vue-->
  <script type="text/javascript" src="../js/vue.js"></script>
<body>
    
    <!-- 准备好一个容器 -->
    <div id="root">
       
        
            
    </div>
</body>

<script type="text/javascript">
     let number = 18;
     let person = {
        name:'张三',
        sex:'男',
     }
    
       //使用该方法
      Object.defineProperty(person,'age',{
       /*  value:18,
        enumerable:true,//控制属性是否可以枚举,默认值是false
        writable:true,//控制属性是否可以被修改,默认是false
        configurable:true,//控制属性是否可以被删除,默认值是false */
        //当有人读取person的age属性时,get函数(getter)就回被调用,且返回值就是age的值
        get: function(){
          console.log('有人读取了age属性')
          return number
        },
        //当有人修改person的age属性时,set函数(setter)就回被调用,且会收到修改的具体指
        set:function(value){
          console.log('有人修改了age属性,且值是,'+value)
          number = value
        }
     })

     console.log(person)


</script>

</html>